body {
    background-color: #fff;
}



.flex-col,
.flex,
.row,
.col {
    display: flex;
    flex-wrap: wrap;

    &.nowrap {
        flex-wrap: nowrap;
    }

    &.start {
        align-items: flex-start;
    }

    &.end {
        align-items: flex-end;
    }

    &.w100 {
        width: 100%;
    }

    &.h100 {
        height: 100%
    }

    .lf {
        margin-right: auto;
    }

    .rt {
        margin-left: auto;
    }

}

.row,
.col {
    align-items: center;

}

.row {
    flex-direction: row;
}

.flex-col,
.col {
    flex-direction: column;
}


.dk_ {

    &line {

        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;

        &_1 {
            -webkit-line-clamp: 1;
        }

        &_2 {
            -webkit-line-clamp: 2;
        }

        &_3 {
            -webkit-line-clamp: 3;
        }
    }


    &bottom_nav {

        display: flex;
        box-shadow: 0px -2px 15px 0px #dedede;
        align-items: center;
        width: 100%;
        background-color: #f8f8f8;
        padding-top: 10rpx;
        padding-left: 20rpx;
        padding-right: 20rpx;
        padding-bottom: calc(constant(safe-area-inset-bottom) + 10rpx);
        padding-bottom: calc(env(safe-area-inset-bottom) + 10rpx);
        margin-bottom: 30rpx;

        .input-wrapper {
            .input-inline {}
        }

        .btn {
            width: 100rpx;
            height: 60rpx;
            line-height: 60rpx;
            text-align: center;
            color: #000;
            margin-left: 15rpx;
            border-radius: 15rpx;
            background: #f00;
            font-size: 24rpx;
            color: #fff;
        }
    }
}

.dk_btn {
    width: 690rpx;
    color: #fff;
    background: linear-gradient(to right, #E897F4, #B055E9) !important;
    border-radius: 40rpx;
    height: 100rpx;
    justify-content: center;
    display: flex;
    align-items: center;
    font-style: 40rpx;
    font-weight: 600;
}
